<%--
  Created by IntelliJ IDEA.
  User: Gavin
  Date: 2016/1/24
  Time: 23:15
  To change this template use File | Settings | File Templates.
--%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <base href="<%=basePath%>">
    <title>首页</title>
    <link rel="stylesheet" href="static/themes/bootstrap/easyui.css">
    <link rel="stylesheet" href="static/css/base.css">
    <script src="static/javascript/jquery-1.11.3.min.js"></script>
    <script src="static/javascript/jquery.easyui.min.js"></script>
    <script src="static/javascript/utils.js"></script>
    <script src="static/javascript/base.js"></script>

    <link rel="stylesheet" href="plugins/bootstrap-3.3.5-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="plugins/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css">
    <script src="plugins/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
    <style type="text/css">
        .scrollNews{
            width:200px;
            height:20px;
            line-height:20px;
            overflow:hidden;
            background:#FFFFFF;
        }

        .scrollNews li{
            height:20px;
        }
    </style>

    <script type="text/javascript" language="JavaScript">
        function drawTagBackground(){
            $(".tag").each(function (){
                if ($(this).text().indexOf("篮球") != -1){
                    $(this).css("background-color","blue");
                } else if ($(this).text().indexOf("红球") != -1) {
                    $(this).css("background-color","red");
                }
            });
        }
        function slideNotice(){
            var $this=$("#notice");
            var scrollTimer;
            $this.hover(function(){
                clearInterval(scrollTimer);
            },function(){
                scrollTimer = setInterval(function() {
                    scrollNews($this);
                }, 2000);
            }).trigger("mouseleave");
            function scrollNews(obj)
            {
                var $self=obj.find("ul");
                var lineHeight=$self.find("li:first").height();
                $self.animate({
                    "marginTop":-lineHeight+ "px"
                }, 600, function(){
                    $self.css({
                        marginTop:0
                    }).find("li:first").appendTo($self);
                })
            }
        }

        $(document).ready(function(){
            drawTagBackground();
            slideNotice();

            $("#notice a").click(function () {
                value = $(this).attr("name");
                obj=$.ajax({url:"notice/show?noticeId=" + value,async:false});
                $("#main").html(obj.responseText);
            });
        });
    </script>

</head>
<body>

<div class="container">
    <div>
        <jsp:include page="head.jsp"/>
    </div>

    <div class="content" id="main" width="100%" style="overflow: auto">
        <div id="notice" class="scrollNews">
            <ul>
                <c:forEach items="${notices}" var="notice" varStatus="vs">
                    <li>公告：<a name="${notice.id}"><c:out value="${notice.title}"/></a></li>
                </c:forEach>
            </ul>
        </div>
        <div class="row">
            <div class="col-xs-6 col-sm-6 col-md-6">
                <p>双色球 第${latestBall.issue}期 开奖日期：${latestBall.drawDate}<spring:eval expression="latestBall.drawDate"></spring:eval></p>
                <p>红球：${latestBall.redOne} ${latestBall.redTwo} ${latestBall.redThree} ${latestBall.redFour} ${latestBall.redFive} ${latestBall.redSix} 篮球：${latestBall.blue}</p>
                <div class="row">
                    <div class="col-xs-8 col-sm-8 col-md-8">
                        <table class="table-bordered">
                            <tr>
                                <th>奖项</th>
                                <th>中奖注数</th>
                                <th>单注奖金</th>
                                <th>中奖条件</th>
                            </tr>
                            <c:forTokens items="${latestBall.prizeInfo}" delims="$" var="line">
                                <tr>
                                    <c:forTokens items="${line}" delims=";" var="item">
                                        <td><c:out value="${item}"/></td>
                                    </c:forTokens>
                                </tr>
                            </c:forTokens>
                        </table>
                    </div>
                    <div class="col-xs-4 col-sm-4 col-md-4 center-align">
                        <h4>当前奖金池：${latestBall.currentPrizePool}</h4>
                    </div>
                </div>
            </div>
            <div class="col-xs-6 col-sm-6 col-md-6">
                <table class="table-bordered">
                    <tr>
                        <th>编号</th>
                        <th>文章标题</th>
                        <th>发表时间</th>
                    </tr>
                    <c:forEach items="${articles}" var="article" varStatus="vs">
                        <tr>
                            <td><c:out value="${vs.index + 1}"/></td>
                            <td><span class="tag">[<c:out value="${article.tag}"/>]</span><a href="article/show?articleId=${article.id}"><c:out value="${article.title}"/></a></td>
                            <td><c:out value="${article.submitTime}"/><spring:eval expression="article.submitTime"></spring:eval></td>
                        </tr>
                    </c:forEach>
                </table>
            </div>
        </div>

    </div>

    <div>
        <jsp:include page="footer.jsp"/>
    </div>
</div>

<%--<div id="ajax"></div>--%>
<%--<button id="b01" type="button">点击我</button>--%>

<%--<script type="application/javascript" language="JavaScript">--%>
<%--$(document).ready(function(){--%>
<%--$("#b01").click(function(){--%>
<%--htmlobj=$.ajax({url:"ajax/query",async:false});--%>
<%--$("#ajax").html(htmlobj.responseText);--%>
<%--});--%>
<%--});--%>
<%--</script>--%>

<%--<c:if test="condition"></c:if>--%>

<%--<% if(session.getAttribute("userName") != null) {%>--%>
<%--<jsp:forward page="/WEB-INF/views/logged-in.jsp"/>--%>
<%--<% } else { %>--%>
<%--<jsp:forward page="/WEB-INF/views/not-logged-in.jsp"/>--%>
<%--<% }%>--%>
</body>
</html>
